<template>
	<div>
    <div class="div_3">
      <div class="div_4">
      	<ul class="ul_3">
      		<li class="li">手机 电话卡</li>
      		<li>电视 盒子</li>
      		<li>笔记本 平板</li>
      		<li>家电 插线板</li>
      		<li>出行 穿戴</li>
      		<li>智能 路由器</li>
      		<li>电源 配件</li>
      		<li>健康 儿童</li>
      		<li>耳机 音响</li>
      		<li>生活 箱包</li>
      	</ul>
      	<img class="img_3" src="../assets/img/w8.png" />
      </div>
    </div>
    <div>
    	<img class="img_4" src="../assets/img/img4.png" />
    </div>
    <div class="div_5">
    	<span class="span_1">小米闪购</span>
    	<img class="img_5" src="../assets/img/img5.png" />
    	<img class="img_6" src="../assets/img/img6.png" />
    </div>
  </div>
</template>

<script>
	export default{
		data(){
			return{

			}
		},
		components:{

		},
		methods:{

		}
	}
</script>

<style type="text/css">
  .div_3 {
  	position: relative;
  	width: 100%;
  	height: 450px;
  }
  .ul_3 {
  	position: absolute;
  	top: 2%;
  }
  .div_4 {
  	position: absolute;
  	height: 450px;
  	width: 80%;
  	left: 10%;
  	background-color: #3f3d3d;
  }
  .ul_3 li{
  	list-style:none;
  	font-size: 16px;
  	display:block; width:220px; height:41px;
  	color: #FFF8F0;
    padding: 0px 0px 0px 30px;
  }
  .ul_3 .li{
    padding: 20px 0px 0px 30px;
  }
  .ul_3 li::after {
  	position: absolute;
  	content: url(../assets/img/af.png);
  	left: 235px;
  }
  .img_3 {
  	position: absolute;
  	left: 23%;
  	width: 78.5%;
  	height: 450px;
  }
  .img_4 {
  	position: absolute;
  	left: 10.3%;
  	width: 80.5%;
  }
  .div_5 {
  	position: relative;
  	width: 100%;
  	height: 560px;
  	top: 200px;
  	background-color: #f5f5f5;
  }
  .span_1 {
  	position: absolute;
  	top: 10px;
  	left: 10%;
  	font-size: 24px;
  	font-family: '宋体';
  }
  .img_5 {
  	position: absolute;
  	top: 50px;
  	left: 10%;
  	width: 81%;
  }
  .img_6 {
  	position: absolute;
  	width: 65px;
  	height: 24px;
  	top: 24px;
  	left: 86.7%;
  }
</style>
